<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>vue定义组件</title>
    <script src= "../vue/vue.js"></script>
</head>
<body>
    <div id="app">
        <ul>
            <my-componment-li v-for="item in items" v-bind:item="item"></my-componment-li>
        </ul>

    </div>

    <script>
        //定义一个组件
        Vue.component("my-componment-li",{
            props:["item"],
            template:'<li >{{item}}</li>'
        })
        new Vue({
            el:"#app",
            data:{
                items:["古力娜扎","迪丽热巴","马尔扎哈"]
            }

        })
    </script>
</body>
</html>